<template>
	<view class="FX">
		<view class="wz">
			<view class="wz-one" v-for="(item,index) in articleList" :key="index" @click="FXClick(item)">
				<img :src="item.showImg" alt="" srcset="">
				<view class="wz-text-title">
					{{item.title}}
				</view>
				<view class="wz-text">
					{{item.createTime}}
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import http from "../../static/http.js"
	export default {
		data() {
			return {
				articleList:[]
			}
		},
		created() {
			
		},
		onShow() {
			this.getAllArticle()
		},
		methods: {
			getAllArticle(){
				http.httpRequest("/api/user/getAllArticle","","GET").then(res=>{
					if(res.data.length>0){
						res.data.forEach(val=>{
							val.showImg = http.BASE_URL + val.imageList[0].url
						})
					}
					this.articleList = res.data
				})
			},
			FXClick(item){
				uni.navigateTo({
					url:"/pages/fx/fxdetails?id="+item.id,
				})
			}
		}
	}
</script>

<style lang="less">
.FX{
	width: 100%;
	background-color: #f0f0f5;
	.wz{
		width: 98%;
		height: auto;
		margin: auto;
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: space-around;
		padding-bottom: 100rpx;
		.wz-one{
			width: 45%;
			height: 400rpx;
			margin-bottom: 20rpx;
			margin-top: 20rpx;
			background-color: #fff;
			border-radius: 10rpx;
			img{
				width: 100%;
				height: 60%;
				border-top-left-radius: 10rpx;
				border-top-right-radius: 10rpx;
			}
			.wz-text-title{
				width: 100%;
				height: 20%;
				padding: 5rpx;
				overflow: hidden;
				text-overflow: ellipsis;
				-webkit-line-clamp: 2;
				-webkit-box-orient: vertical;
				display: -webkit-box;
				font-weight: 600;
			}
			.wz-text{
				width: 100%;
				height: 10%;
				padding-left: 10rpx;
				overflow: hidden;
				text-overflow: ellipsis;
				white-space: nowrap;
				font-size: 25rpx;
			}
		}
	}
}
</style>
